<template>
	<f7-page id="leave" navbar-fixed data-page='leave'>
		<f7-navbar v-if="$theme.ios">
			<f7-nav-left sliding>
				<div class="left">
					<a class="back" href="#">
						<i class="iconfont icon-zuo"></i>
						<span>返回</span>
					</a>
				</div>
			</f7-nav-left>
			<f7-nav-center sliding>请假</f7-nav-center>
			<f7-nav-right>
				<a href="#">
					<i></i>
				</a>
			</f7-nav-right>
		</f7-navbar>

		<div class="l-content">
			<div class="list-block nomargin">
				<ul>
					<li>
						<div class="item-content">
							<div class="item-inner">
								<div class="item-title label">请假类型</div>
								<div class="item-input clearfix">
					            	<input class="left" type="text" placeholder="请选择(必填)" readonly id="picker-type">
					        	</div>
					        </div>
					    </div>
					</li>
				</ul>
			</div>
			<div class="list-block l-c-margin">
				<ul>
					<li>
						<div class="item-content">
							<div class="item-inner">
								<div class="item-title label">开始时间</div>
								<div class="item-input clearfix">
            						<input class="left" type="text" placeholder="请选择(必填)" readonly id="beginTime">
        						</div>
					        </div>
					    </div>
					</li>
					<li>
						<div class="item-content">
							<div class="item-inner">
								<div class="item-title label">结束时间</div>
								<div class="item-input clearfix">
            						<input class="left" type="text" placeholder="请选择(必填)" readonly id="endTime">
        						</div>
					        </div>
					    </div>
					</li>
					<li>
						<div class="item-content">
							<div class="item-inner">
								<div class="item-title label">时长</div>
								<div class="item-input clearfix">
            						<input class="left" type="text" placeholder="请输入时间(必填)">
        						</div>
					        </div>
					    </div>
					</li>
				</ul>
			</div>
			<div class="list-block l-c-margin">
				<ul>
				    <!-- Additional "align-top" class for correct textarea alignment -->
				    <li class="align-top">
				    	<div class="item-content">
				        	<div class="item-inner">
				        		<div class="item-title label">请假事由</div>
			        			<div class="item-input">
			            			<textarea placeholder="请输入请假事由(必填)"></textarea>
			        			</div>
				        	</div>
				    	</div>
				    </li>
				</ul>
			</div>
			<div class="l-c-nameselect">
				<div class="l-c-n-title">审批人</div>
  				<ul class="l-c-n-namenav clearfix">
  					<li class="left"><a href="/namechoise/"><div><i class="icon iconfont icon-wodedangxuan"></i></div><span class="choisename">姓名</span></a></li>
  					<li class="left next"><i class="icon iconfont icon-iconfontjiantou"></i></li>
  					<li class="left waitechoise"><a href="/namechoise/"><div><i class="icon iconfont icon-jia"></i></div></a></li>
  				</ul>
			</div> 
		</div>

	</f7-page>

</template>

<script>
	import InitPage from '../components/PageInit.vue';
	export default {
		data: function() {
			return {
				isShow: false
			}
		},
		mounted: function(){
			this.init();
			
		},
		methods: {
			init: function(){
				/*this.$ajax.aboutOur().then(res => {

				});*/
				this.timeInit();
				this.pk();
			},
			timeInit: function(){
				let now = new Date();
				InitPage.TimeInit('#beginTime', this,[new Date().setMonth(now.getMonth() - 1)]);
				InitPage.TimeInit('#endTime', this,[now]);
			},
			pk:function(){
				var app = new Framework7();
				var myPicker = app.picker({
				    input: '#picker-type',
				    cols: [
				       {
				         values: ['病假', '调休', '事假']
				       }
				     ]
				});
			},
			show:function(){
				this.isShow=!this.isShow;
			}

		},
		components:{ InitPage } 
	}
</script>